/* eslint-disable lit/no-invalid-html */
import "../index.js";
import { Readable } from "node:stream";
import { html, render } from "@lit-labs/ssr";

// const tShadowRoot = await import("@webcomponents/template-shadowroot");
// tShadowRoot.hasNativeDeclarativeShadowRoots
const ssrResult = render(html`
  <html>
    <head>
      <meta charset="utf-8" />
    </head>
    <body>
      <app-shell>
        <app-page-one></app-page-one>
        <app-page-two></app-page-two>
      </app-shell>

      <script type="module">
        // Hydrate template-shadowroots eagerly after rendering (for browsers without
        // native declarative shadow roots)
        import {
          hasNativeDeclarativeShadowRoots,
          hydrateShadowRoots,
        } from "./node_modules/@webcomponents/template-shadowroot/template-shadowroot.js";
        if (!hasNativeDeclarativeShadowRoots()) {
          hydrateShadowRoots(document.body);
        }
        // ...
        // Load and hydrate components lazily
        import("./component/index.js");
      </script>
    </body>
  </html>
`);

// ...

// context.body = Readable.from(ssrResult);
